<template>
	<div class="List">
		<van-row>
			<van-col span="1">
			</van-col>
			<van-col span="22">

				<van-pull-refresh v-model="loading" @refresh="onRefresh">
				</van-pull-refresh>
				<div>
					<van-nav-bar title="消息" left-text="" >
						<template #right>
							<van-icon name="search" size="23" />
						</template>
					</van-nav-bar>
				</div>
				<van-notice-bar
				  left-icon="volume-o"
				  text="24小时专业问诊看诊,需要者请直接联系000-00000000"
				/>
				<van-cell is-link @click="showPopup">消息通知</van-cell>
				<van-popup v-model:show="show"></van-popup>
				<van-popup v-model:show="show" position="top" :style="{ height: '30%' }">
					暂时没有任何消息
				</van-popup>
			</van-col>
			<van-col span="1">
			
			</van-col>
		</van-row>
	</div>
</template>

<script>
import { ref } from 'vue';
import { Toast } from 'vant';

export default {
  setup() {
    const count = ref(0);
    const loading = ref(false);
    const onRefresh = () => {
      setTimeout(() => {
        Toast('刷新成功');
        loading.value = false;
        count.value++;
      }, 1000);
    };
	const show = ref(false);
	const showPopup = () => {
	  show.value = true;
	};
    return {
      count,
      loading,
      onRefresh,
	  show,
	  showPopup,
    };
  },
};
</script>

<style>
  .doge {
    width: 140px;
    height: 72px;
    margin-top: 8px;
    border-radius: 4px;
  }
</style>
